<template>
    <sc-dialog :title="`学生 ${rowData.studentName} 企微信息`" v-model="propValue" custom-class="studentInfoPopup" width="70vw" top="50px" @open="open"
               @close="$emit('input', false)">
        <div class="dialog-content pl30 pr30">

            <avue-crud
                :table-loading="loading"
                ref="crud"
                :option="option"
                :data="data.parents"

            >
                <!-- 自定义列 -->
                <template slot-scope="{ row }" slot="relation">
                    <span>{{ row.relation }}</span>
                </template>
                <template slot-scope="{ row }" slot="is_subscribe">
                    <el-tag :type="row.is_subscribe ? '' : 'danger'">{{ row.is_subscribe ? "已关注" : "未关注" }}</el-tag>
                </template>
            </avue-crud>
        </div>
        <span slot="footer" class="dialog-footer mt30">
            <el-button size="mini" @click="_close">关 闭</el-button>
        </span>
    </sc-dialog>
</template>
<script>

export default {
    props: {
        value: {
            type: Boolean,
            default: false
        },
        rowData: {
            type: Object,
            default: () => ({})
        }
    },
    data() {
        return {
            loading:true,
            data: {},
            option: {
                addBtn: false,
                delBtn: false,
                editBtn: false,
                menu: false,
                header: false,//头部操作栏显影
                border: true, //边框
                stripe: false, //斑马线
                showHeader: true, //表头
                index: true, //是否显示表格序号
                indexWidth: 80, //序号列宽度
                indexLabel: '序号', //序号列名称,
                indexFixed: true, //序号列是否冻结
                column: [
                    {
                        label: "孩子关系",
                        prop: "relation",
                        slot: true,
                    },
                    {
                        label: "联系方式",
                        prop: "mobile",

                    },
                    {
                        label: "是否关注门禁消息",
                        prop: "is_subscribe",
                        slot: true,
                    },
                ]
            }
        };
    },
    computed: {
        propValue: {
            get() {
                return this.value;
            },
            set(nval) {
                this.$emit("input", nval);
            }
        }
    },
    methods: {
        //关闭弹窗
        _close() {
            this.$emit("input", false);
        },
        async open() {
            this.loading = true
            const {schoolId, cpStudentUserId} = this.rowData
            const {code, data} = await this.$api.schoolConfig.studentList.getWxCpInfo({
                schoolId,
                cpStudentUserId
            })
            if (code === 200) {
                this.data = data.student
            }
            this.loading = false
        }
    }
};
</script>
<style lang="scss" scoped>
.studentInfoPopup {
    .dialog-content {
    }
}
</style>
